<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<title></title>
	<link rel="stylesheet" href="../static/front/login/css/login_frame.css" />
</head>
<body>
	<!-- 透明遮罩 -->
	<div class="m-shaded"></div>
	<!-- 窗体 -->
	<div class="m-window">
		<div class="m-hd">
			<p class="m-logo">
				<img src="../static/common/img/w-logo.png" alt="logo" title="众用助手" height="40">
				<span>zhongyongapp.com</span>
			</p>
		</div>
		<div class="m-bd">
			<form id="J_frm" class="m-fm" method="post">
				<input type="hidden" name="to" value="" />
				<ul>
					<li>
						<label for="J_uname">
							<span class="u-tips">用户名</span>
						</label>
						<input id="J_uname" class="u-uname" type="text" name="account" tabindex="1" />
					</li>
					<li id="J_pwdLi">
						<label for="J_pwd">
							<span class="u-tips">密码</span>
						</label>
						<input id="J_pwd" class="u-pwd" type="password" name="password" tabindex="2" />
					</li>
					<li class="f-tac">
                        <input id="J_sbm" class="u-sbm" type="submit" value="登  录" tabindex="3" />
                    </li>
                    <li class="f-cb">
                    	<a class="m-find-pwd" href="#"  target="_blank">忘记密码？</a>
                    	<a class="m-reg-id" href="#" target="_blank">注册新用户&gt;&gt;</a>
                    </li>
				</ul>
			</form>
		</div>
	</div>
	<script type="text/javascript" src="../static/common/js/jquery-1.9.1.min.js"></script>
	<script type="text/javascript">
	function __login() {
        this.objUserName	= null;
        this.objPassword	= null;
    	this.username		= '';
		this.username_pla	= '';
		this.password		= '';
		this.objMessage		= '';

		this.btn			= null;
		
		this.checkUrl		= '#';
		this.checkDataType	= 'json';

		this.ini();
	}
	
    __login.prototype = {
		ini: function() {
			this.objUserName	= $('#J_uname');
    		this.objPassword	= $('#J_pwd');
			this.btn			= $('#J_sbm');
			this.objMessage		= $('#J_err');

			if (this.objUserName.val().length != 0) {
				this.objPassword.focus();
			}

			// 大小写锁定提示
			this.capsLock();
			
			// IE10之下input没有placeholder功能
			this.placeholder();
		},
		showMessage: function(message, show) {
			var message = message || '';
			var show	= show === false ? show : true;
			
			if(this.objMessage.length == 0){
				this.objMessage = $("<p id='J_err' class='u-err'></p>");
				this.objMessage.appendTo("#J_pwdLi").text(message);
			}else{
				this.objMessage.text(message);
			}
	
			if(show) this.objMessage.show();
			else this.objMessage.hide();
		},
		success: function(jsonData) {
			if (jsonData.state == 'SUCCESS') {
				// 登录成功直接跳转
				window.location.href = jsonData.url;
			}else if(jsonData.state == 'ISOLD' || jsonData.state == 'NO_ACTIVATE') {
				this.showMessage(jsonData.message);
				this.jump(jsonData.url);
			}else {
				this.objPassword.val(''); // 默认都会设置密码文本框为空
				if (jsonData.state == 'NOT_FOUND') {
					this.objUserName.val('').focus(); // 给文本框焦点
				}else if (jsonData.state == 'WRONG_PASSWORD') {
					this.objPassword.focus(); // 给文本框焦点
				}else if (jsonData.state == 'WEAK_PASSWORD') { // 弱密码,跳转到修改密码页面
					this.showMessage(jsonData.message);
					setTimeout(function(){location.href="";}, 1200);
				}
				this.showMessage(jsonData.message);
				this.resumeButton();
			}
		},
		error: function() {
			this.showMessage('服务器错误');
			this.resumeButton();
		},
		verification: function() {
			this.username		= $.trim(this.objUserName.val());
			this.username_pla	= $.trim(this.objUserName.attr('placeholder'));
			this.password		= $.trim(this.objPassword.val());
			
			if (this.username.length == 0 || this.username === this.username_pla) {
				this.objUserName.val('').focus(); // 给文本框焦点并设置为空
				this.showMessage('请输入账号');
				return false;
			}
			
			if (this.password.length == 0) {
				this.objPassword.val('').focus(); // 给文本框焦点并设置为空
				this.showMessage('请输入密码');
				return false;
			}else {
				//var hash = this.password = CryptoJS.MD5(this.password);
				//this.objPassword.val(hash);
			}
			
			return true;
		},
		post: function() {
			if( this.objMessage.length != 0 ) {
				this.showMessage('', false);
			};/*隐藏错误提示框*/
			var _this = this;
			
			if (this.verification()) {
				// 禁用按钮
				this.btn.addClass('z-disabled').val('登录中...').prop('disabled', true);
				var busy = setTimeout(function() {
					this.showMessage("服务器繁忙，请耐心等待...");
				}, 3000);
				
				$.ajax({
					url: this.checkUrl,
					data: $("form").serialize(),
					dataType: this.checkDataType,
					cache: false,
					type: 'POST',
					success: function(jsonData){_this.success(jsonData);},
					statusCode: {
						500: function() {
							_this.showMessage("服务器错误");
							_this.objPassword.val('').focus();
						},
						200: function() {
							clearInterval(busy);
						}
					},
					error: function(){_this.error();}
				});
			}
		},
		jump: function(url) {
			var num = 3, btn = this.btn, txt = '秒后自动跳转到相应地址...';
			
			btn.val(num + txt).attr('url', url);

            num -= 1;
            
            var countDown = setInterval(function() {
                if(num){
                	btn.val(num + txt);
                    num -= 1;
                }else{
                    countDown && clearInterval(countDown);
                    window.parent.location.href = btn.attr('url');
                }
            }, 1000);
		},
		placeholder: function() {
			if( !("placeholder" in document.createElement("input")) ) {
				// 使用JQ获取，this.getAttribute在低级的IE下不起效果
                
				$("input[placeholder]").not("input[type=password]").focus(function() { 
	                if( this.value === $(this).attr("placeholder") ){
	                    this.value = "";
	                    this.style.color = "#000";
	                }
	            }).blur(function() {
	                if( this.value === "" ){
	                    this.value = $(this).attr("placeholder");
	                    this.style.color = "#a9a9a9";
	                }               
	            }).blur();
	        }
		},
		capsLock: function() {
			this.objPassword[0].onkeypress = function(event){
				var e = event||window.event,
				$tip = $('#capslock'),
				kc  =  e.keyCode || e.which, // 按键的keyCode
				isShift  =  e.shiftKey ||(kc  ==   16 ) || false ; // shift键是否按住
				if (((kc >=65&&kc<=90)&&!isShift)|| ((kc >=97&&kc<=122)&&isShift)){
					$tip.show();
				}
				else{
					$tip.hide();
				}
			};
		},
		resumeButton: function() {
			this.btn.removeClass('z-disabled').prop('disabled', false).val('登 录');
		}
	}
//		$(document).ready(function(){ alert("1"); });
	$(document).ready(function(){
		/*=== 输入框背景提示文字 ===*/
		$("#J_frm label").siblings("input").on('focus', function(){
			$(this).siblings("label").hide();
		}).on('blur', function(){
			if($(this).val().length<1)
				$(this).siblings("label").show();
		});
		
		var login = new __login();
        $("#J_sbm").click(function() {
        	login.post();
			return false;
        });
        
		$("#J_sbm").prop("disabled", false);/*for firefox bug*/
	});
	</script>
</body>
</html>
